<template>
  <a-modal
    :visible="visible"
    title="新增跟进进度"
    cancelText="取消"
    okText="提交"
    width="60%"
    @ok="submit"
    @cancel="cancel"
  >
    <a-form
      ref="formRef"
      :model="formState.state"
      :rules="formRules"
      :label-col="labelCol"
      :wrapper-col="wrapperCol"
    >
      <a-row>
        <!-- <a-col :span="12">
          <a-form-item label="跟进人" name="followName">
            <a-input
              v-model:value="formState.state.followName"
              readonly
              placeholder="选择跟进人"
            >
              <template #addonAfter>
                <div
                  class="primary-color cursor-pointer"
                  @click="openDialog()"
                >
                  选择
                </div>
              </template>
            </a-input>
          </a-form-item>
        </a-col> -->
        <a-col :span="12">
          <a-form-item label="跟进时间" name="createTime">
            <a-date-picker disabled v-model:value="formState.state.createTime" valueFormat="YYYY-MM-DD hh:mm:ss" show-time placeholder="请选择" style="width: 100%"/>
          </a-form-item>
        </a-col>
        <a-col :span="12">
          <a-form-item label="跟进备注" name="remark">
            <a-textarea
              v-model:value="formState.state.remark"
              placeholder="请输入"
              maxlength="200"
              :auto-size="{ minRows: 2, maxRows: 5 }"
            />
          </a-form-item>
        </a-col>
        <a-col :span="12">
          <a-form-item label="下次跟进时间" name="nextTime">
            <a-date-picker v-model:value="formState.state.nextTime" valueFormat="YYYY-MM-DD hh:mm:ss" show-time placeholder="请选择" style="width: 100%"/>
          </a-form-item>
        </a-col>
        <a-col :span="12">
          <a-form-item label="下次跟进备注" name="nextRemark">
            <a-textarea
              v-model:value="formState.state.nextRemark"
              placeholder="请输入"
              maxlength="200"
              :auto-size="{ minRows: 2, maxRows: 5 }"
            />
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>
    <BasicTableModal
      v-model:visible="formState.show"
      v-if="formState.show"
      :columns="formState.commonColumns"
      :fetchAjax="formState.api"
      :title="formState.title"
      :searchForm="formState.searchForm"
      @selectUniversity="
        (value) => selectItem(value)
      "
    />
  </a-modal>
</template>
<script setup>
import {onMounted, reactive, ref, watch,nextTick, toRaw, defineEmits, defineProps } from "vue";
import { getDictByCodesReturnObj } from '@/tools/get-dict'
import BasicTableModal from "@/component/basic-table-modal";
import dictEnum from '@/const/dict'
import { mainUser } from "@/api/module/channel-manage";
import { page as userPage } from "@/api/module/user";
import {
  followSave
} from "@/api/module/student/student-bop-manage";
import {message} from "ant-design-vue";
import { useI18n } from "vue-i18n";
import moment from "moment";

const { t } = useI18n();
const emit = defineEmits(['close'])
const props = defineProps({
  parent: {
    type: Object,
    default: () => {}
  },
})
let isLoading = ref(false)
const formRef = ref();
const formState = reactive({
  state: {
    stuInfoId: props.parent.id || '',
    lightId: props.parent.lightId || '',
    // state: '',
    remark: '',
    nextRemark: '',
    nextTime: '',
    // followName: '',
    // followId: '',
    createTime: moment(new Date()).format('YYYY-MM-DD hh:mm:ss')
  },
  show: false,
  api: userPage,
  title: '选择跟进人',
  searchForm: [
    {
      label: t("student-bop-manage.openDialog.nickname"),
      key: "nickname",
      type: "input",
      placeholder: t("placeholder.pleaseEnter"),
    },
  ],
  commonColumns: [
    {
      dataIndex: "nickname",
      key: "nickname",
      title: t("student-bop-manage.openDialog.nickname"),
    },
    {
      dataIndex: "deptName",
      key: "deptName",
      title: t("student-bop-manage.openDialog.deptName"),
    },
    {
      dataIndex: "postName",
      key: "postName",
      title: t("student-bop-manage.openDialog.postName"),
    },
  ]
});
const saveKey = "save";
const labelCol = { span: 6 }
const wrapperCol = { span: 18 }
let dictLists = reactive({
  data: {}
})

const formRules = {
  nextTime: [ { required: true, type: 'date', message: '请选择时间', trigger: 'blur'} ],
  // state: [ { required: true, message: '请选择跟进状态', trigger: 'blur'} ],
};


const submit = (e) => {
  formRef.value
    .validate()
      .then(() => {
        if (formState.state.id) {
          followSave(toRaw(formState.state)).then((response)=>{
            if(response.success){
              message.success({ content: '保存成功', duration: 1 }).then(()=>{
                cancel();
              });
            }else{
              message.warning({ content: '保存失败', duration: 1 }).then(()=>{
                cancel();
              });
            }
          });
        } else {
          followSave(toRaw(formState.state)).then((response)=>{
            if(response.success){
              message.success({ content: '保存成功', duration: 1 }).then(()=>{
                cancel();
              });
            }else{
              message.warning({ content: '保存失败', duration: 1 }).then(()=>{
                cancel();
              });
            }
          });
        }
      })
      .catch(error => {
        console.log('error', error);
    });
};
const cancel = (e) => {
  formRef.value.resetFields();
  emit("close", formState.state);
};
const openDialog = () => {
  formState.show = true
}
const selectItem = (value) => {
  formState.state.followName = value.nickname
  formState.state.followId = value.id
  nextTick(() => {
    formState.show = false
  })
}
onMounted(async () => {
  dictLists.data = await getDictByCodesReturnObj([
    dictEnum.STU_FOLLOW_STATE,
  ])

})


</script>
<style lang="">

</style>
